<template>
	<div>
		<div class="hr"></div>
		<div>我是Jerry</div>
		<button @click="tomAdd">tom+2</button>
		<div>jerry:{{ value }}</div>
	</div>
</template>

<script>
	import Eh from '../eventHub.js'
	export default {
		// name: 'tom',
		data() {
			return {
				key: 1,
				num: 2,
				value: 1
			}
		},
		methods: {
			tomAdd() {
				Eh.$emit('jAdd', this.num)
			}
		},
		mounted() {
			// 2.监听事件listenToTom
			Eh.$on('listenToTom', val => {
				this.value += val
			})
		}
	}
</script>

<style lang="scss" scoped>
	.hr {
		width: 100%;
		height: 5px;
		background: greenyellow;
	}
</style>
